<template>
  <div class="container">
    <template>
      <el-table :data="tableData" style="width: 100%">
        <el-table-column prop="taskName" label="项目名">
        </el-table-column>
        <el-table-column prop="startTime" label="开始日期">
        </el-table-column>
        <el-table-column prop="endTime" label="结束日期">
        </el-table-column>
        <el-table-column prop="totalTime" label="持续时间(天)">
        </el-table-column>
        <el-table-column prop="actual_process" label="项目进度">
        </el-table-column>
        <el-table-column prop="personInCharges" label="负责人">
          <template slot-scope="scope">
            <el-tag v-for="item in scope.row.personInCharges" :key="item">{{item}}</el-tag>
          </template>
        </el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button type="text" @click="$router.push('/?id='+ scope.row.id)">编辑</el-button>
          </template>
        </el-table-column>
      </el-table>
    </template>
  </div>
</template>

<script>
import { getGanttData } from '@/utils/mockjs'
export default {
  data() {
    return {
      tableData: []
    }
  },
  mounted() {
    this.getData();
  },
  methods: {
    async getData() {
      const { data } = await getGanttData();
      console.log(data);
      this.tableData = data.data;
    }
  }
}
</script>